<template>
  <div>
    <div class="table">
      <el-table :data="tabledata">
        <el-table-column label="序号" type="index" width="50"></el-table-column>
        <el-table-column label="订单" prop="id"></el-table-column>
        <el-table-column label="租赁汽车" prop="carname"></el-table-column>
        <el-table-column label="汽车名称" prop="carimg">
          <template slot-scope="scope">
            <el-image
              style="width: 100px; height: 100px"
              :src="scope.row.carimg"
              :preview-src-list="[scope.row.carimg]"
            >
            </el-image>
          </template>
        </el-table-column>
        <el-table-column label="租赁人" prop="name"></el-table-column>
        <el-table-column label="租赁时间" prop="zlsj"></el-table-column>
        <el-table-column label="归还时间" prop="ghsj"></el-table-column>
        <el-table-column label="总价" prop="price"></el-table-column>
        <el-table-column label="状态" prop="status">
          <template slot-scope="scope">
            <span v-if="scope.row.status == 0">待审核</span>
            <span v-if="scope.row.status == 1">通过</span>
            <span v-if="scope.row.status == 2">驳回</span>
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button type="primary" v-if="scope.row.status == 0" @click="bj(scope.row)" plain
              >审核</el-button
            >
            <!-- <el-button type="danger" @click="shanchu(scope.row)" plain
              >删除</el-button
            > -->
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        background
        layout="total,prev, pager, next"
        :total="total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      >
      </el-pagination>
    </div>
    <el-dialog width="30%" title="审核" :visible="dialogVisible">
      <el-form :model="form1">
        <el-form-item label="审核理由">
         <el-radio-group v-model="form1.status">
      <el-radio label="1">审核</el-radio>
      <el-radio label="2">驳回</el-radio>
    </el-radio-group>
        </el-form-item>
        <el-form-item label="备注">
          <!-- <el-upload
            class="avatar-uploader"
            action="http://demonuxtapi.dishait.cn/admin/s/upload"
            :headers="headers"
            :show-file-list="false"
            :on-success="handleAvatarSuccess"
          >
            <img v-if="form1.icon" :src="form1.icon" class="avatar" />
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload> -->
          <el-input type="textarea" placeholder="备注" v-model="form1.remark"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button plain @click="save()" type="primary">确定</el-button>
          <el-button plain @click="reset()">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>
<script>
import service from "../request";

export default {
  data() {
    return {
      form: {
        pageNum: 1,
        pageSize: 10,
      },
      title: "新增",
      form1: {
        icon: "",
      },
      dialogVisible1: false,
      dialogVisible: false,
      headers: {
        token:
          "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlbWFpbCI6IjQ1NioqKkBxcS5jb20iLCJwaG9uZSI6IjEzNyoqKio1NDQ5IiwiaWQiOjEsInVzZXJuYW1lIjoiY2VzaGkxIiwibmlja25hbWUiOiIiLCJwYXNzd29yZCI6IjA5MTNmYWIyOWY4YWE5MmY5N2ZlNjQ2ODM5NDA5ZjM3MjZjNGQzZGM2NGY0NDlmMTA2MjJhNTUwMGM3NDBjMDIiLCJhdmF0YXIiOiIiLCJ3ZWl4aW5fdW5pb25pZCI6bnVsbCwic2V4Ijoi5pyq55-lIiwiZGVzYyI6IiIsInN0YXR1cyI6MSwiY3JlYXRlZF90aW1lIjoiMjAyMS0wMi0yMVQxNDowNDowMi4wMDBaIiwidXBkYXRlZF90aW1lIjoiMjAyMy0xMC0wNFQxNjo0ODo0MC4wMDBaIiwiaWF0IjoxNjk4NTYyOTU4fQ.MLAxkr9JkR9lIxEZbufSuBDB_kz-GR8UYEvwB3NslcA",
        schoolid: "11",
      },
      total: 0,
      tabledata: [],
    };
  },
  mounted() {
    this.getdata();
  },
  methods: {
    shanchu(row) {
      this.$confirm("是否确认删除？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(async () => {
          const res = await service.get(`/index/shanchupp`, {
            params: {
              id: row.id,
            },
          });
          if (res.code == 200) {
            this.$message({
              type: "success",
              message: "删除成功!",
            });
            this.getdata();
          }
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    reset() {
      this.form1 = {};
      this.dialogVisible = false;
    },
    async save() {
      const res = await service.post("index/sh", this.form1);
      if (res.code == 200) {
        this.$message.success(`${res.msg}`);
        this.dialogVisible = false;
        this.getdata();
      }
    },
    add() {
      this.title = "新增";
      this.dialogVisible = true;
      this.form1 = {
        name: "",
        icon: "",
      };
    },
    bj(row) {
      this.title = "编辑";
      this.dialogVisible = true;
      this.form1 = JSON.parse(JSON.stringify(row));
    },
    handleAvatarSuccess(e) {
      console.log(e);
      this.form1.icon = e.data;
      console.log(this.form1.icon);
    },
    handleCurrentChange(e) {
      this.form.pageNum = e;
      this.getdata();
    },
    handleSizeChange(e) {
      this.form.pageSize = e;
      this.getdata();
    },
    fj(row) {
      this.form1 = JSON.parse(JSON.stringify(row));
      this.form1.fjly = "";
      this.form1.status = "1";
      this.dialogVisible1 = true;
    },
    async fjqd() {
      const res = await service.post("/index/adduser", this.form1);
      console.log(res);
      if (res.code == 200) {
        this.$message.success("修改成功");
        this.dialogVisible1 = false;
        this.getdata();
      }
    },
    async shenheqd() {
      const res = await service.post("/index/adduser", this.form1);
      console.log(res);
      if (res.code == 200) {
        this.$message.success("修改成功");
        this.dialogVisible = false;
        this.getdata();
      }
    },
    sh(row) {
      this.form1 = JSON.parse(JSON.stringify(row));

      this.form1.status = "";
      this.dialogVisible = true;
    },
    handleClose() {
      this.dialogVisible = false;
    },
    handleClose1() {
      this.dialogVisible1 = false;
    },
    chongzhi() {
      this.form = {
        name: "",
        pageNum: 1,
        pageSize: 10,
      };
      this.getdata();
    },
    chaxun() {
      this.getdata();
    },
    async getdata() {
      const res = await service.get("/index/zllist", {
        params: this.form,
      });
      console.log(res);
      this.tabledata = res.data;
      this.total = res.total;
    },
  },
};
</script>
<style>
.el-upload:hover {
  border-color: #409eff;
}

.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.el-upload {
  border: 1px dashed #d9d9d9 !important;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>